<template>
  <t-config-provider :global-config="globalLocale">
        <t-table
        row-key="id"
        :data="data?.list"
        :columns="columns"
        :bordered="bordered"
        :pagination="pagination"
        cell-empty-content="-"
        resizable
        lazy-load
        @change="rehandleChange"
      >
    </t-table>
    <!-- @page-change="onPageChange" -->
    <!-- :rowspan-and-colspan="rowspanAndColspan" -->
  </t-config-provider>
</template>
<script lang="jsx" setup>
import { reactive, ref } from 'vue';
import { useRouter } from 'vue-router';
import { CaretDownSmallIcon } from 'tdesign-icons-vue-next';
import _ from 'lodash';
const router = useRouter();
const props = defineProps({
  data: {
    type: Object,
    default: () =>{}
  },
  fromMenu: {
    type : Number,
    default: 0
  }
})
// ,assessModel,assessLevel,approvalProcess,isDetail,approvalStatus
const goRoute = (path, id) =>{
  const query = {}
  if (id) {
    query.id = id
  }
  // if(assessModel){
  //   query.assessModel = assessModel
  // }
  // if(assessLevel){
  //   query.assessLevel = assessLevel
  // }
  // if(approvalProcess){
  //   query.approvalProcess = approvalProcess
  // }
  // if(isDetail){
  //   query.isDetail = isDetail
  // }
  // if(approvalStatus){
  //   query.approvalStatus = approvalStatus
  // }
  router.push({
    path: './' + path,
    query,
  })                         
}
//----------------------------------------分页相关处理---------------------------------------------
const emit = defineEmits(["refreshList"]);
const pagination = reactive({
  total: props.data.total,
  showJumper: true,
  current: 1, // 当前页码
  pageSize: 10, // 每页条数
});

const refreshData = (total) => {
  pagination.current = 1
  pagination.pageSize = 10
  pagination.total = total
}

// 2. 明确暴露方法
defineExpose({
  refreshData
})

const rehandleChange = (changeParams, triggerAndData) => {
  // console.log('分页、排序、过滤等发生变化时会触发 change 事件：', changeParams, triggerAndData);
  console.log('=rehandleChange==>',changeParams,triggerAndData)
  if(changeParams?.sorter){//排序
    pagination.current = 1
    emit('refreshList',changeParams)
  }else if(changeParams?.pagination){ //分页
    pagination.current = changeParams.pagination.current;
    pagination.pageSize = changeParams.pagination.pageSize;
    emit('refreshList',changeParams)
  }else{
    pagination.current = 1
    emit('refreshList','')
  }
};
// // BaseTable 中只有 page-change 事件，没有 change 事件
// const onPageChange = async (pageInfo) => {
//   console.log('page-change', pageInfo);
//   // 下面为受控方式，如果使用此方式，将pagination内的defaultCurrent改为current
//   pagination.value.current = pageInfo.current;
//   pagination.value.pageSize = pageInfo.pageSize;

//   emit('refreshList',pageInfo)
// };

const bordered = ref(true);
const globalLocale = ref({
  table: {
    sortIcon: (h) => h && <CaretDownSmallIcon size="16px" />,
  },
});       
//approvalStatus 0-审核中 1-不通过(有数据不合格) 2-通过(全部合格)
const statusNameListMap = {
  0: { label: '已完成'},
  1: { label: '未提交', theme: 'danger' },
  2: { label: '待调整资料', theme: 'warning' },
  3: { label: '待审核资料', theme: 'warning' },
  4: { label: '待上传报告', theme: 'warning' },
  5: { label: '待上传评审结果', theme: 'warning' },
}; 
 const assessModelListMap = {
    0: { label: 'DCMM'},
    1: { label: 'DSMM' },
    2: { label: '数据合规'},
  }; 
const columns = ref([
  { colKey: 'assessNo', title: '项目编号' ,width:'140',
  },
  { colKey: 'assessName', title: '项目名称',ellipsis: true},
  { colKey: 'assessModel', title: '评估类型', wdith:'100',
  cell: (h, { row }) => {
      return (
        <span>
          {assessModelListMap[row?.assessModel]?.label}
        </span>
      );
    },},
  { colKey: 'company', title: '公司主体名称' ,ellipsis: true},
  { colKey: 'submitTime', title: '用户提交时间',
    sorter:true,width:'180'},
  { colKey: 'approvalTime', title:'审核更新时间',
    sorter: true, // 启用排序
    width:'180'
  },
  {
    colKey:'approval_process',
    title: '状态',
    sorter:true,
    width:'140',
    cell: (h, { row }) => {
        let statusText = '';
        let theme = '';
        if(row.approvalProcess === 0){//确认工作计划
           statusText ='查看工作计划';
           theme='primary';
        }else if(row.approvalProcess === 1){//审核填报资料
          if(row.approvalStatus === 0){
            statusText ='待审核资料';
            theme='warning';
          }else if(row.approvalStatus === 1){
            statusText ='待调整资料';
            theme='warning';
          }
        }else if(row.approvalProcess === 2){ //访谈评估
          statusText ='访谈评估';
          theme='warning';
        } else if(row.approvalProcess === 3){ //评分结果表
          statusText ='评分结果表';
          theme='warning';
        }else if(row.approvalProcess === 4){ //出具报告
          statusText ='待上传报告';
          theme='warning';
        }else if(row.approvalProcess === 5){ //上传评审报告结果
          statusText ='待上传评审结果';
          theme='warning';
        }
        // else if(row.approvalProcess === 5){//上传评审结论
        //   statusText ='待上传评审结论';
        //   theme='warning';
        // }
        else if(row.approvalProcess === 6){//已完成
          statusText ='已完成';
          theme="default"
        }
        return <t-tag theme={theme} variant="light">{statusText}</t-tag>;
    },
  },
  {
      colKey: 'operation',
      title: '操作',
      width:'120',
      cell: (h, { row }) => {
     //approvalProcess 0 确认工作计划  1 审核填报资料  2 访谈评估  3 评分结果表  4 出具报告   5 上传评审报告   6 已完成
        let operateTxt = '';
        let clickHandler = null; // 定义点击事件处理器
          if(row.approvalProcess === 0){//确认工作计划
            operateTxt ='查看详情';
          }else if(row.approvalProcess === 1){//审核填报资料
            if(row.approvalStatus === 0){ ////待审核资料
              operateTxt ='审核资料';
            }else if(row.approvalStatus === 1){ //有不合格的审核  查看详情
              operateTxt ='查看详情';
            }
          }else if(row.approvalProcess === 2){ //访谈评估
            operateTxt ='编辑访谈评估';
          }else if(row.approvalProcess === 3){ //评分结果表  
            operateTxt ='查看评分结果表';
          }else if(row.approvalProcess === 4){ //出具报告
            operateTxt ='上传报告';
          }else if(row.approvalProcess === 5){ //上传评审结果 
            operateTxt ='上传评审结果';
          }else if(row.approvalProcess === 6){ //已完成 查看详情
            operateTxt ='查看详情';
          }
          clickHandler = () => {
            dealClick(row)
          }
        return <t-link hover="color" theme="primary" onClick={ clickHandler }> { operateTxt } </t-link>;
      },
    },
]);

function dealClick(row){
  if(props.fromMenu === 0){
    goRoute('assessProject/audit/index',row.id);
  }else{
    goRoute('index',row.id);
  }
}

// const groupedItems = computed(() => {
//   // 为每个项添加索引
//   const itemsWithIndex = props.data?.list.map((item, index) => ({
//     ...item,
//     index
//   }));
//   return _.groupBy(itemsWithIndex, 'assessNo');
// });
// const duplicateItems = computed(() => {
//   const duplicates = {};
//   for (const [assessNo, group] of Object.entries(groupedItems.value)) {
//     if (group.length > 1) {
//       duplicates[assessNo] = group;
//     }
//   }
//   return duplicates;
// });
// const duplicateSummary = computed(() => {
//   return Object.entries(duplicateItems.value)
//     .filter(([_, group]) => group.length > 1)
//     .map(([assessNo, group]) => ({
//       assessNo,
//       firstIndex: group[0].index,
//       count: group.length
//     }));
// });
// //可合并的表格
// const rowspanAndColspan = ({row, col, rowIndex, colIndex }) => {
//   if(colIndex === 0 || colIndex === 1){
//     for(let i = 0 ;i<duplicateSummary.value.length;i++){
//     if( rowIndex === duplicateSummary.value[i].firstIndex){
//     return {
//       colspan: 1,
//       rowspan: duplicateSummary.value[i].count,
//     };
//   }
//   }
// }
// };

</script>
<style lang="scss" scoped>
:deep(.t-table__double-icons) {
    color: #C9CDD4;
}
:deep(.t-table__double-icons .t-table-sort-asc ){
    top: 3px;
}
:deep(.t-table__double-icons .t-table-sort-desc) {
    bottom: 3px;
}
:deep(.t-pagination__number ){
    color: #4E5969;
    border: 1px solid #fff;
    font-weight: 600;
}
:deep(.t-pagination__number.t-is-current ){
    background-color: #E8F3FF;
    border: 1px solid #E8F3FF;
    color: #165DFF;
    font-weight: 600;
}
:deep(.t-pagination__total ){
  flex: none;
  margin-right: 10px;
  color: #1D2129;
}

:deep(.t-table__content) {
  border: 1px solid #E5E6EB;
  border-radius: 8px;
}
:deep(.t-table__header >tr) {
  background-color: #F7F8FA;
}
// :deep(.t-table__th-cell-inner) {
//   color: #4E5969;
//   font-size: 14px;
//   font-weight: 600;
// }
.home-container{
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 16px;
}
.top-container{
  display: flex;
  height: 88px;
  background: var(--bg-white);
  border-radius: 8px;
  padding: 0 16px;
  position: relative;
  &__img{
    width: 56px;
    height: 56px;
    margin-right: 10px;
    margin-top: 16px;
  }
  &__title{
      color: #565960;
      font-size: 12px;
      margin-top: 16px;
    }
   
    &__value{
      color: #252931;
      font-size: 18px;
      font-weight: bold;
      margin-top: 16px;
    }  
    &__btn{
      right: 16px;
      top: 16px;
      position: absolute;
      color: #1966FF;
    }
}
.index {
  padding: 0;
  margin-top: 16px;
}
</style>
